元件的宣告分為"全域元件"和"區域元件"，在Vue2.0中，全域元件可以通過Vue.component('元件名稱', 屬性)來註冊，在Vue3.0則是需要先透過Vue.createApp()建立一個新實體(名稱:app)，再定義一個"app.component('元件名稱', 屬性)"，然後通過它將新的原件註冊到app的根元件裡面。主要是在Vue3.0將全域的概念從整個Vue改變為"根實體"，這樣可以避免在宣告多個根實體之後它們互相汙染。

<div id="app">
  <h3>Root Instance</h3>

  <child-comp></child-comp>
  <child-comp></child-comp>
</div>

const vm = Vue.createApp({
  data() {
    return {
      count: 0
    }
  }
});

vm.component('child-comp', {
	template: `
    <div class="app-child">
      <div>Hello Vue!</div>
    </div>`
});

vm.mount('#app');

區域型元件則是在上層元件的components屬性裡面來定義，也可以在環境支援ES Module情況下，使用import來引入外簿子元件，在使用上全域元件與區域元件並沒有什麼差異，只是跟字面上一樣，全域元件的使用範圍是整個應用程式，區域元件則是只能在宣告過components:{...}屬性之後的元件才能使用。

const app = Vue.createApp({
    components: {
        'my-component' : {
            template: '<div>hello</div>',
        }
    }
});
app.mount('#app);